﻿@* ReSharper disable UnknownCssClass *@

@model OpusSuite.Models.Model.Ref.Language

<script src="@Url.Content("~/Scripts/grid.locale-en.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.jqGrid.min.js")" type="text/javascript"></script>

<div id="applicationMessagesLanguageSelect">@Html.Partial("ApplicationMessages", "LanguageSelect")</div>        

<header>
<h1>Blah de blah</h1>
</header>
<br />
<br />

@using (Html.BeginForm("LanguageSelect", "Ref", FormMethod.Post, new { id = "languageForm" }))
{
    <fieldset>
        <legend></legend>

        @Html.TextBox("Dialog_Language_Id", (int)ViewBag.Id, new { @style = "display: none" })
        @Html.TextBoxFor(model => model.Variant, new { @id = "Dialog_Language_Variant", @style = "display: none" })

        <table class="table-editor">
        <tr>
            <td class="td-horiz-label">@Html.LabelFor(model => model.Code, new { @class = "label-horiz" })</td>
            <td class="td-horiz-field">@Html.TextBoxFor(model => model.Code, new { @id = "Dialog_Language_Code", @class = "editor-horiz", @disabled = "disabled" })</td>
        </tr>
        <tr>
            <td class="td-horiz-label">@Html.LabelFor(model => model.Name, new { @class = "label-horiz" })</td>
            <td class="td-horiz-field">@Html.TextBoxFor(model => model.Name, new { @id = "Dialog_Language_Name", @class = "editor-horiz" })</td>
        </tr>        
        <tr>
            <td class="td-horiz-label">@Html.LabelFor(model => model.Description, new { @class = "label-horiz" })</td>
            <td class="td-horiz-field">@Html.TextBoxFor(model => model.Description, new { @id = "Dialog_Language_Description", @class = "editor-horiz" })</td>
        </tr> 
        <tr>       
        <td colspan="3" style="text-align: right">
                <a id="Dialog_Language_Filter" class="uiButton">Filter</a>
                <a id="Dialog_Language_Edit" class="uiButton EditButton">Edit</a>
                <a id="Dialog_Language_Clear" class="uiButton">Clear</a>
                <a id="Dialog_Language_Add" class="uiButton AddButton">Add</a>
                <a id="Dialog_Language_Delete" class="uiButton">Delete</a>
        </td>
        </tr>
        </table>
    </fieldset>

    <fieldset>
        <legend></legend>

        <table id="languageList"></table>
        <div id="languagePager"></div>
   </fieldset>
}

<script type="text/javascript">

    jQuery(document).ready(function () {
        var selectedSubmit = "edit";

        $(".uiButton").button();

        jQuery("#languageList").jqGrid({
            autowidth: true,
            altRows: false,
            height: 120,
            url: '/Ref/LanguageSelectData',
            datatype: 'json',
            mtype: 'GET',
            page: 1,
            postData:
                {
                    'Id': 0,
                    'Code': '',
                    'Name': '',
                    'Description': ''
                },
            colNames: ['Id', 'Code', 'Name', 'Description'],
            colModel: [
          { name: 'Id', index: 'Id', width: 0, align: 'left', hidden: true },
          { name: 'Code', index: 'Code', width: 60, align: 'left' },
          { name: 'Name', index: 'Description', width: 150, align: 'left' },
          { name: 'Description', index: 'Language', width: 200, align: 'left'}],
            pager: jQuery('#languagePager'),
            rowNum: 5,
            rowList: [5, 10, 20, 50],
            sortname: 'Name',
            sortorder: "asc",
            viewrecords: true,
            caption: 'Languages',
            //onSelectRow: function (rowid, status) {
            onSelectRow: function (rowid) {
                if ($("#Dialog_Language_Clear").hasClass('CancelButton')) {
                    alert("Please save or cancel the current operation first");
                }
                else {
                    $("#Dialog_Language_Id").val($(this).getCell(rowid, 'Id'));
                    $("#Dialog_Language_Code").val($(this).getCell(rowid, 'Code'));
                    $("#Dialog_Language_Name").val($(this).getCell(rowid, 'Name'));
                    $("#Dialog_Language_Description").val($(this).getCell(rowid, 'Description'));
                    languageSelectDisplayMode();
                }
            }
        });

        $("#Dialog_Language_Edit").click(function () {
            if ($(this).hasClass('EditButton')) {
                if ($("#Dialog_Language_Code").val() !== "") {
                    languageSelectEditMode();
                }
                else {
                    $("#dialogOpusMessage").opusMessage('show', { message: 'Please select a language first', btnOK:true, btnCancel:false });
                }
            }
            else {
                $("#languageForm").validate();
                if ($("#languageForm").valid()) {
                    $(document).oneTime(200, function () {
                        $("#progressSpinner").progressSpinner('open', {
                            'title': 'Opus Suite - Saving Record',
                            'imgUrl': '/Content/themes/south-street/progress-spinner.gif")',
                            'waitText': 'Saving record, please wait'
                        });
                        selectedSubmit = "edit";
                        $("#languageForm").submit();
                    });

                    languageSelectDisplayMode();
                }
            }
        });

        $("#Dialog_Language_Clear").click(function () {
            if ($(this).hasClass('CancelButton')) {
                languageSelectCancel();
            }
            else {
                languageSelectClear();
            }
        });

        $("#Dialog_Language_Add").click(function () {
            if ($(this).hasClass('AddButton')) {
                if ($("#Dialog_language_Code").val() !== "") {
                    languageSelectAddMode();
                }
                else {
                    alert('Please select a language first');
                }
            }
            else {
                $("#languageForm").validate();
                if ($("#languageForm").valid()) {
                    $("#progressSpinner").progressSpinner('open', {
                        'title': 'Opus Suite - Saving Record',
                        'imgUrl': '/Content/themes/south-street/progress-spinner.gif")',
                        'waitText': 'Saving record, please wait'
                    });
                    $(document).oneTime(200, function () {
                        selectedSubmit = "add";
                        $("#languageForm").submit();
                        languageSelectDisplayMode();
                    });
                }
            }
        });

        $("#Dialog_Language_Filter").click(function (e) {
            e.preventDefault();
            var language = {
                Id: $("#Dialog_Language_Id").val(),
                Code: $("#Dialog_Language_Code").val(),
                Name: $("#Dialog_Language_Name").val(),
                Description: $("#Dialog_Language_Description").val()
            };

            jQuery("#languageList").jqGrid('setGridParam', {
                page: 1,
                postData:
                    {
                        'Id': language.Id,
                        'Code': language.Code,
                        'Name': language.Name,
                        'Description': language.Description
                    }
            }).trigger('reloadGrid');
        });

        $("#Dialog_Language_Delete").click(function (e) {
            e.preventDefault();

            $("#progressSpinner").progressSpinner('open', {
                'title': 'Opus Suite - Saving Record',
                'imgUrl': '/Content/themes/south-street/progress-spinner.gif")',
                'waitText': 'Saving record, please wait'
            });
            $(document).oneTime(200, function () {
                selectedSubmit = "delete";
                $("#languageForm").submit();
                languageSelectDisplayMode();
            });
        });

        $("#languageForm").submit(function (e) {
            e.preventDefault();
            var language = {
                Id: $("#Dialog_Language_Id").val(),
                Code: $("#Dialog_Language_Code").val(),
                Name: $("#Dialog_Language_Name").val(),
                Description: $("#Dialog_Language_Description").val()
            };

            if (selectedSubmit !== "delete") {
                $.ajax({
                    url: '/Ref/LanguageSelectSave',
                    type: "POST",
                    data: JSON.stringify(language),
                    dataType: "json",
                    contentType: "application/json; charset=utf-8",
                    success: function (data) {
                        $("#progressSpinner").progressSpinner('closeWindow');
                        jQuery("#languageList").jqGrid('setGridParam',{page:1, postData: { 'selectedId': language.Id }}).trigger('reloadGrid');
                        $.get('/Shared/ApplicationMessages', {}, function (view) {
                            $("#applicationMessagesLanguageSelect").html(view);
                        });
                        languageSelectCancel();
                        languageSelectDisplayMode();
                        $("#Dialog_Language_Id").val(data.Id);
                        $("#Dialog_Language_Code").val(data.Code);
                        $("#Dialog_Language_Name").val(data.Name);
                        $("#Dialog_Language_Description").val(data.Description);
                    },
                    //failure: function (data) {
                    failure: function () {
                        $("#progressSpinner").progressSpinner('closeWindow');
                    }
                });
            } else {
                $.ajax({
                    url: '/Ref/LanguageSelectDelete',
                    type: "POST",
                    data: JSON.stringify(language),
                    dataType: "json",
                    contentType: "application/json; charset=utf-8",
                    //success: function (data) {
                    success: function () {
                        $("#progressSpinner").progressSpinner('closeWindow');
                        jQuery("#languageList").jqGrid('setGridParam', { page: 1, postData: { 'selectedId': 0} }).trigger('reloadGrid');
                        $.get('/Shared/ApplicationMessages', {}, function (view) {
                            $("#applicationMessagesLanguageSelect").html(view);
                        });
                        languageSelectClear();
                    },
                    //failure: function (data) {
                    failure: function () {
                        $("#progressSpinner").progressSpinner('closeWindow');
                    }
                });
            }
        });

        function languageSelectCancel() {
            if ($("#Dialog_Language_Edit").hasClass("SaveButton")) {
                $("#Dialog_Language_Code,#Dialog_Language_Name, #Dialog_Language_Description").attr('disabled', 'disabled').addClass('ui-state-disabled');
                $("#Dialog_Language_Edit,#Dialog_Language_Add").button('enable');
                $("#Dialog_Language_Edit").removeClass('SaveButton').addClass('EditButton').button("option", "label", 'Edit');
                $("#Dialog_Language_Clear").button('option', 'label', 'Clear').removeClass('CancelButton');
                $("#Dialog_Language_Delete").button("disable");
                var id = $("#Dialog_Language_Id").val();
                if (parseInt(id) != 0)
                    languageSelectReloadForm(id);
            }
            else {
                $("#Dialog_Language_Code,#Dialog_Language_Name, #Dialog_Language_Description").attr('disabled', 'disabled').addClass('ui-state-disabled');
                $("#Dialog_Language_Add,#Dialog_Language_Filter").button('enable');
                $("#Dialog_Language_Add").removeClass('SaveButton').addClass('AddButton').button("option", "label", 'Add');
                $("#Dialog_Language_Clear").button('option', 'label', 'Clear').removeClass('CancelButton');
                $("#Dialog_Language_Edit,Dialog_Language_Delete").button("disable");
            }
            $("#Dialog_Language_Code").focus();
        }

        function languageSelectClear() {
            languageSelectEditMode();
            $("#Dialog_Language_Filter,#Dialog_Language_Add").button("enable");
            $("#Dialog_Language_Edit,#Dialog_Language_Delete").button("disable");
            $("#Dialog_Language_Clear").button('option', 'label', 'Clear').removeClass('CancelButton');
            $("#Dialog_Language_Code,#Dialog_Language_Name,#Dialog_Language_Description,#Dialog_Language_Id").val('');
        }

        function languageSelectDisplayMode() {
            $("#Dialog_Language_Code,#Dialog_Language_Name,#Dialog_Language_Description").attr('disabled', 'disabled').addClass('ui-state-disabled');
            $("#Dialog_Language_Filter,#Dialog_Language_Delete").button('disable');
            $("#Dialog_Language_Edit,#Dialog_Language_Clear,#Dialog_Language_Add").button('enable');
        }

        function languageSelectEditMode() {
            $("#Dialog_Language_Code,#Dialog_Language_Name,#Dialog_Language_Description").removeAttr('disabled').removeClass('ui-state-disabled');
            $("#Dialog_Language_Add, #Dialog_Language_Filter").button('disable');
            $("#Dialog_Language_Delete").button('enable');

            $("#Dialog_Language_Edit").removeClass('EditButton').addClass('SaveButton').button("option", "label", 'Save');
            $("#Dialog_Language_Clear").button('enable').button('option', 'label', 'Cancel').addClass('CancelButton');
            $("#Dialog_Language_Code").focus();
        }

        function languageSelectAddMode() {
            $("#Dialog_Language_Edit, #Dialog_Language_Filter, #Dialog_Language_Delete").button('disable');
            $("#Dialog_Language_Add").removeClass('AddButton').addClass('SaveButton').button("option", "label", 'Save');
            $("#Dialog_Language_Clear").button('enable').button('option', 'label', 'Cancel').addClass('CancelButton');
            $("#Dialog_Language_Code,#Dialog_Language_Name,#Dialog_Language_Description,#Dialog_Language_Id").val('').removeAttr('disabled').removeClass('ui-state-disabled');
            $("#Dialog_Language_Code").focus();
        }

        function languageSelectReloadForm(languageId) {
            $.ajax({
                url: '/Ref/Language',
                type: "GET",
                data: { id: languageId },
                dataType: "json",
                contentType: "application/json; charset=utf-8",
                success: function (data) {
                    $("#Dialog_Language_Id").val(data.Id);
                    $("#Dialog_Language_Code").val(data.Code);
                    $("#Dialog_Language_Name").val(data.Name);
                    $("#Dialog_Language_Description").val(data.Description);
                }
            });
        }

        languageSelectDisplayMode();
    });
</script>
@* ReSharper restore UnknownCssClass *@
